<template>
	<!--logs.wxml-->
	<view class="view_contain">
		<!-- 第一部分 -->
		<view class="view_1">
			<view class="view_image_text">
				<!-- <image v-if="{{!userInfo}}" class="image_radius" src="/static/nologin.png" /> -->
				<!-- <button v-if="{{!userInfo}}" @tap="login" class="login">授权登录</button> -->
				<view class="root">
					<image class="touxiang" :src="userInfo.avatarUrl"></image>
					<text class="nicheng">{{userInfo.nickName}}</text>
					<button @tap="loginOut" class="loginOut">退出登录</button>
				</view>
			</view>
		</view>
		<!-- 第二部分 -->
		<view class="view_2">
			<view class="view_tupianwenzi">
				<image class="image_tupian" src="/static/testCase.png"></image>
				<text class="text">考试</text>
			</view>
			<view class="view_tupianwenzi">
				<image class="image_tupian" src="/static/moldTest.png"></image>
				<text class="text">模考</text>
			</view>
			<view class="view_tupianwenzi">
				<image class="image_tupian" src="/static/evaluation.png"></image>
				<text class="text">评价</text>
			</view>
			<view class="view_tupianwenzi">
				<image class="image_tupian" src="/static/analyse.png"></image>
				<text class="text">分析</text>
			</view>


		</view>
		<!-- 第三部分 -->
		<view class="view_3">

			<view class="list-item">
				<image class="item-image" src="/static/myApply.png"></image>
				<text class="item-text">我的报名</text>
				<image class="image-jiantou" src="/static/right.png"></image>
			</view>
			<view class="line"></view>
			<view class="list-item" @click="toProInfo()">
				<image class="item-image" src="/static/myData.png"></image>
				<!-- <text class="item-text">我的资料</text> -->
				<navigator url="../../perInfo/perInfo" class="item-text">我的资料</navigator>
				<image class="image-jiantou" src="/static/right.png"></image>
			</view>
			<view class="line"></view>
			<view class="list-item" @click="toMy">
				
				<image class="item-image" src="/static/aboutUs.png"></image>
				<!-- <text class="item-text">关于我们</text> -->
				<navigator url="../pages/aboutus/aboutus" class="item-text">关于我们</navigator>
				<image class="image-jiantou" src="/static/right.png"></image>
			</view>
			<view class="line"></view>
			<view class="list-item">
				<image class="item-image" src="/static/Settings.png"></image>
				<text class="item-text">设置</text>
				<image class="image-jiantou" src="/static/right.png"></image>
			</view>
			<view class="line"></view>
			<view class="list-item">
				<image class="item-image" src="/static/share.png"></image>
				<text class="item-text">分享邀请</text>
				<image class="image-jiantou" src="/static/right.png"></image>
			</view>
			<view class="line"></view>
			<view class="list-item">
				<image class="item-image" src="/static/complaints.png"></image>
				<text class="item-text">投诉</text>
				<image class="image-jiantou" src="/static/right.png"></image>
			</view>
			<view class="line"></view>
			<view class="list-item" @click="toFaceEntry()">
				<image class="item-image" src="/static/face.png"></image>
				<text class="item-text">人脸录入</text>
				<image class="image-jiantou" src="/static/right.png"></image>
			</view>
			<view class="line"></view>
			<view class="list-item" @click="toFacedistinguish()">
				<image class="item-image" src="/static/facedit.png"></image>
				<text class="item-text">人脸识别</text>
				<image class="image-jiantou" src="/static/right.png"></image>
			</view>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				logs: [],
				userInfo: ''
			}
		},
		onLoad() {
			// this.setData({
			// 	logs: (wx.getStorageSync('logs') || []).map(log => {
			// 		return util.formatTime(new Date(log))
			// 	})
			// })
		},
		methods: {
			toMy(){
				uni.navigateTo({
					url: '../aboutus/aboutus'
				});
			},
			toFaceEntry(){
				uni.navigateTo({
					url: '../FaceRecognition/FaceEntry'
				});
			},
			toFacedistinguish(){
				uni.navigateTo({
					url: '../FaceRecognition/FaceDistinguish'
				});
			},
			toProInfo(){
				uni.navigateTo({
					url: '../aboutus/perInfo'
				});
			}
			// login() {
			// 	console.log("点击了事件执行了！！")
			// 	// wx.getUserProfile({
			// 	// 	desc: '必须授权才可以继续使用',
			// 	// 	success: res => {
			// 	// 		let user = res.userInfo
			// 	// 		console.log("授权成功！！！！用户信息", res.userInfo)
			// 	// 		this.setData({
			// 	// 			userInfo: user
			// 	// 		})
			// 	// 	},
			// 	// 	fail: res => {
			// 	// 		console.log("授权失败！！！！", res)
			// 	// 		wx.showToast({
			// 	// 			title: "授权失败！！！！",
			// 	// 			icon: "none", //不要图标
			// 	// 			duration: 2000 //显示时长
			// 	// 		});
			// 	// 	}

			// 	// })
			// },
			// //退出登录
			// loginOut() {
			// 	this.setData({
			// 		userInfo: ''
			// 	})
			// }
		}
	}
</script>

<style>
	/* 使用page就是为了保证  满屏 */
	/* 第一部分 */
	.login {
		height: 80rpx;
		background-color: #41bedd;
	}

	.loginOut {
		height: 80rpx;
		background-color: #41bedd;
	}


/* 	.root {
		display: flex;
		flex-direction: column;
		align-items: center;
	} */

	.touxiang {
		width: 150rpx;
		height: 150rpx;
		border-radius: 50%;
		margin-top: 30rpx;
		margin-bottom: 10rpx;
	}


	.view_1 {
		display: flex;
		justify-content: center;
		width: 100%;
		height: 25%;
		background: #41bedd;
		/* background-image: image("../images/2.jpg"); */
	}




	.view_image_text {
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
	}

	.image_radius {
		height: 50px;
		width: 50px;
		border-radius: 30px;
	}

	/* 第二部分 */

	.view_2 {
		width: 100%;
		height: 15%;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: center;
		background: white;
		margin-top: 30rpx;

	}

	.view_tupianwenzi {
		display: flex;
		flex-direction: column;
		width: 120rpx;
		align-items: center;
		margin-left: 25rpx;
		margin-right: 25rpx;
	}

	.image_tupian {
		display: flex;
		width: 100rpx;
		height: 100rpx;
	}

	/* 第三部分 */

	.view_3 {
		width: 100%;
		height: 50%;
		/* background: #f0eeed; */
	}

	.list-item {
		display: flex;
		flex-direction: row;
		align-items: center;
		width: 100%;
		height: 80rpx;
		margin-top: 20rpx;
		position: relative;
		/*父元素位置要设置为相对*/
		background: white;
	}

	.item-image {
		width: 50rpx;
		height: 50rpx;
		margin: 20rpx;
	}

	.item-text {
		color: gray;
		font-size: 35rpx;
		margin-left: 20rpx;
	}

	.image-jiantou {
		width: 20rpx;
		height: 35rpx;
		position: absolute;
		/* 要约束所在位置的子元素的位置要设置成绝对 */
		right: 0;
		/* 靠右调节 */
		margin-right: 35rpx;
	}

	/* 黑线 使得产生阴影效果 */

	.line {
		width: 100%;
		height: 3rpx;
		background: lightgray;
		margin-left: 90rpx;
	}
</style>
